<template>
  <div>
    <component :is="one"></component>

    <div id="root">
      <div id="container">
        <div id="content2">
          <table width="100%" height="41" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td width="15" height="18" align="left" valign="top">
                <div align="left"></div>
              </td>
              <td width="385" align="left" valign="bottom" class="12">&nbsp;</td>
            </tr>
            <tr>
              <td height="4" colspan="2" align="left" valign="bottom"></td>
            </tr>
            <tr>
              <td height="15" align="left" valign="top">&nbsp;</td>
              <td height="15" align="left" valign="top" class="12">
                <table width="100%" height="20" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td height="20">
                      <div class="right_proaducts">我的位置&gt;&gt;科技项目申报&gt;项目分类列表<br />
                        <br />
                      </div>
                      <!--                                <form action="" method="post" id="form">-->
                      <DIV class=padding>
                        <DIV id=middlebody>
                          <table cellspacing="0" cellpadding="0" width="100%" border="0">
                            <tbody>
                              <tr>
                                <td>
                                  <div align="left">|&nbsp;&nbsp;欢迎,admin&nbsp;&nbsp;|&nbsp;&nbsp;
                                    <a class="table_t" href="#/">注销      </a>&nbsp;&nbsp;|&nbsp;&nbsp;
                                    <a href="javascript:history.go(-1)">后退</a>&nbsp;&nbsp;|
                                  </div>
                                </td>
                                <td>
                                  <div align="center"><a
                                          href="#/admin/showusers">登录用户管理</a>
                                  </div>
                              </td>
                              <td>
                                  <div align="center"><a
                                          href="#/admin/showexperts">专家信息管理</a>
                                  </div>
                              </td>
                              <td height="50">
                                  <div align="center"><a
                                          href="#/admin/showunits">单位信息管理</a>
                                  </div>
                              </td>
                              <td>
                                  <div align="center"><a
                                          href="#/admin/showprojectCategorys">项目管理</a>
                                  </div>
                              </td>
                              </tr>
                            </tbody>
                          </table>
                          <table id="app" class="mars" cellspacing="1" cellpadding="0" width="100%" border="0">
                            <tbody>
                              <tr bgcolor="#fba661" height="30">
                                <td width="7%">
                                  <div align="center">编号ID</div>
                                </td>
                                <td width="15%">
                                  <div align="center">分类名称</div>
                                </td>
                                <td width="18%">
                                  <div align="center">申报开始时间</div>
                                </td>
                                <td width="14%">
                                  <div align="center">申报结束时间</div>
                                </td>
                                <td width="20%">
                                  <div align="center">评审专家</div>
                                </td>
                                <td width="13%">
                                  <div align="center">修改</div>
                                </td>
                                <td width="13%">
                                  <div align="center">删除</div>
                                </td>
                              </tr>

                              <tr bgcolor="#e4f1fe" v-for="(projectCategory,i) in projectCategorys">

                                <td bgcolor="#f3f3f3">
                                  <div align="center">{{i}}</div>
                                </td>
                                <td bgcolor="#f3f3f3">
                                  <div align="center">{{projectCategory.categoryname}}</div>
                                </td>
                                <td bgcolor="#f3f3f3">
                                  <div align="center">{{projectCategory.repStartTime}}</div>
                                </td>
                                <td bgcolor="#f3f3f3">
                                  <div align="center">{{projectCategory.repStopTime}}</div>
                                </td>
                                <td bgcolor="#f3f3f3">
                                  <div align="center">{{projectCategory.expertid}}</div>
                                </td>
                                <td bgcolor="#f3f3f3">
                                  <div align="center">
                                    <button @click="sendProjectCategory(i)">修改</button>
                                  </div>
                                </td>
                                <td bgcolor="#f3f3f3">
                                  <div align="center">
                                    <button @click="deleteProjectCategory(i)">删除</button>
                                  </div>
                                </td>
                              </tr>
                              <tr bgcolor="#e4f1fe">
                                <td height="20" colspan="7" valign="bottom" bgcolor="#FFFFFF">
                                  <div align="center"><a href="#/admin/addprojectcategory">新增加类别</a></div>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </div>
                      </div>
                      <!--                                </form>-->

                    </td>
                  </tr>
                </table>
                <br />
                <div class="table_wz"></div>
              </td>
            </tr>
          </table>
        </div>
      </div>
    </div>
    <component :is="two"></component>
  </div>
</template>
<script>
  import four from '../../util/four';
  import aaa from '@/components/header.vue'
  import bbb from '@/components/footer.vue'
  const options = {
    data() {
      return {
        one: 'aaa',
        two: 'bbb',
        projectCategorys: [],
      }
    },
    components: {
      aaa, bbb
    },
    mounted() {
      this.getAllProjectCategorys();
    },
    methods: {
      getAllProjectCategorys() {
        four.get("/projectCategorys").then((res) => {
          this.projectCategorys = res.data.data;
        })
      },
      deleteProjectCategory(i) {
        this.$confirm('此操作将永久删除此数据包含与其相关子数据, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          four.delete("/projectCategorys/" + this.projectCategorys[i].categoryid).then((res) => {
            this.$message.success(res.data.msg);
            this.getAllProjectCategorys();


          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      sendProjectCategory(i) {
        sessionStorage.setItem("projectCategory", JSON.stringify(this.projectCategorys[i]));
        this.$router.push('/admin/projectinfo');
      }
    },
  }
  export default options;
</script>